<template>
    <div style ="height: 100%;">
        <el-menu backgroud-color="#545c64" text-color="#ffffff" active-text-color="#ffd04b" class="el-menu-vertical-demo" router>
            <el-menu-item index="/index/menu1"><i class="el-icon-location"></i>教师首页</el-menu-item>
            <el-menu-item index="/index/menu2"><i class="el-icon-document"></i>班级管理</el-menu-item>
            <el-menu-item index="/index/menu3"><i class="el-icon-study"></i>学生管理</el-menu-item>
            <el-menu-item index="/index/menu4"><i class="el-icon-courue"></i>课程中心</el-menu-item>
            <el-menu-item index="/index/menu5"><i class="el-icon-courinfo"></i>课程资料</el-menu-item>
        </el-menu>
    </div>
</template>

<script>
    export default {
        name: "Aside",
        data(){
            return {
                menu_data:[
                    {
                        name:'教师首页',
                        icon:'el-icon-location',
                        path:'/index/menu1'
                    },
                    {
                        name:'班级管理',
                        icon:'el-icon-document',
                        path:'/index/menu2'
                    },
                    {
                        name:'学生管理',
                        icon:'el-icon-study',
                        path:'/index/menu3'
                    },
                    {
                        name:'课程中心',
                        icon:'el-icon-courue',
                        path:'/index/menu4'
                    },
                    {
                        name:'课程资料',
                        icon:'el-icon-courinfo',
                        path:'/index/menu5'
                    }
                ]
            }
        }
    }
</script>

<style scoped>
    .el-menu-vertical-demo{
        height: 100%;
    }
</style>